<template>
  <div class="app-container">
    <!-- 搜索工具栏 -->
    <section>
      <so-tool-bar :toolData="toolData" :query="listQuery" @search="search" />
    </section>
    <!-- 其他操作 -->
    <section class="filter-container">
      <el-row>
        <el-col :span="5">
          <el-button type="primary" size="small" @click="effect(1)">生效</el-button>
          <el-button type="primary" size="small" plain @click="effect(0)">取消</el-button>
        </el-col>
        <el-col :span="19">
          <section style="float: right">
            <el-button class="filter-item" type="danger" size="small" @click="delRows">批量删除</el-button>
            <el-button class="filter-item" type="primary" size="small" @click="openAdd">添加行为</el-button>
          </section>
        </el-col>
      </el-row>
    </section>
    <!-- 表格数据 -->
    <el-table :data="tableList" v-loading="loading" element-loading-text="正在查询中。。。" stripe highlight-current-row @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55">
      </el-table-column>
      <el-table-column type="index" align="center" width="50">
      </el-table-column>
      <el-table-column align="center" label="模块">
        <template slot-scope="scope">
          <span>{{conf.module[scope.row.module]}}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="动作" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{conf.action[scope.row.action]}}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="behavior_desc" label="描述" show-overflow-tooltip>
      </el-table-column>
      <el-table-column align="center" prop="integraltype_name" label="积分类别">
      </el-table-column>
      <el-table-column align="center" prop="score" label="分数">
      </el-table-column>
      <el-table-column align="center" label="生效" width="100">
        <template slot-scope="scope">
          <el-switch v-model="scope.row.switch" active-color="#13ce66" inactive-color="#C0C4CC" @change="switchChange(scope.row,$event)"></el-switch>
        </template>
      </el-table-column>
      <el-table-column align="center" label="操作" width="100">
        <template slot-scope="scope">
          <i class="iconfont ali-edit-2" @click="openEdit(scope.row)"></i>
          &nbsp;
          <i class="iconfont ali-bin" @click="delRow(scope.row)"></i>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <section>
      <so-pagination :query="listQuery" @initList="initList" />
    </section>
    <!-- 添加动作模态框 -->
    <section>
      <el-dialog title="选择动作" :visible.sync="addForm.show" width="800px">
        <div class="dialog-table">
          <el-table size="small" :data="dialogList" border v-loading="addForm.loading" element-loading-text="正在查询中。。。" stripe highlight-current-row @selection-change="handleSelectionAction">
            <el-table-column type="selection" width="55">
            </el-table-column>
            <el-table-column prop="id" label="编号"></el-table-column>
            <el-table-column prop="module" label="模块">
              <template slot-scope="scope">
                <p>{{conf.module[scope.row.module]}}</p>
              </template>
            </el-table-column>
            <el-table-column prop="action" label="动作"></el-table-column>
            <el-table-column prop="behavior_desc" label="描述"></el-table-column>
          </el-table>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="addForm.show = false">取 消</el-button>
          <el-button type="primary" @click="addAction">确 定</el-button>
        </span>
      </el-dialog>
    </section>
    <!-- 编辑模态框 -->
    <section>
      <el-dialog title="编辑" :visible.sync="editForm.show">
        <el-form :model="editForm" ref="editForm">
          <el-form-item label="类别" prop="integraltype_id" :rules="filter_rules({required:true})">
            <el-select clearable style="width:400px;" v-model="editForm.integraltype_id" placeholder="请选择">
              <el-option v-for="item in typeList" :key="item.value" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="分数" prop="score" :rules="filter_rules({required:true, type: 'integer'})">
            <el-input clearable style="width: 400px;" placeholder="请输入分数" v-model.number="editForm.score">
            </el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="editForm.show = false">取 消</el-button>
          <el-button type="primary" @click="validate('editForm')">确 定</el-button>
        </span>
      </el-dialog>
    </section>
  </div>
</template>
<script>
import {
  behaviorintegral_list,
  behaviorintegral_edit,
  behaviorintegral_findById,
  behaviorintegral_updateCloseStatus,
  behaviorintegral_delete,
  behaviorintegral_save,
  behaviorintegral_deleteAll
} from '@/api/behaviorintegral'
import { behavior_listAll, behavior_listAllCheck } from "@/api/behavior";
import { searchTool } from '@/utils'
import config from '@/utils/conf'
import SoPagination from '@/components/SoPagination'
import SoToolBar from "@/components/SoToolBar";
import action from "./action";

export default {
  name: "action",
  components: { SoPagination, SoToolBar },
  data() {
    return {
      toolData: [], //工具栏初始化
      loading: false,
      tableList: [],
      dialogList: [],
      conf: config,
      multipleSelection: [],
      typeList: [],
      listQuery: { start: 0, limit: 10, total: 0, current: 1 },
      editForm: { show: false },
      addForm: { show: false, loading: false },
    }
  },
  methods: {
    async addAction() {
      if (!this.addForm.actionList || this.addForm.actionList.length == 0) {
        this.$message.warning("需要选择至少一个动作");
        return;
      }
      this.addForm.show = false;
      this.loading = true;
      if (this.addForm.actionList.length > 1) {
        for (let i = 0; i < this.addForm.actionList.length; i++) {
          let element = this.addForm.actionList[i];
          const parms = { ...element, behavior_id: element.id, company_id: localStorage.getItem("companyId") }
          let { data } = await behaviorintegral_save(parms)
          if (data.status == 100) {
            this.$message.success("添加成功")
          }
        }
        this.loading = false;
      } else if (this.addForm.actionList.length == 1) {
        let element = this.addForm.actionList[0];
        const parms = { ...element, behavior_id: element.id, company_id: localStorage.getItem("companyId") }
        let { data } = await behaviorintegral_save(parms);
        this.loading = false;
        if (data.status == 100) {
          const _id = data.data.id;
          const findData = await behaviorintegral_findById({ id: _id })
          this.openEdit(findData.data.data)
        }
      }
      this.initList();
    },
    handleSelectionAction(e) {//添加模块 选中
      this.addForm.actionList = e;
    },
    async openAdd() {
      this.addForm.show = true;
      this.addForm.loading = true;
      let { data } = await behavior_listAllCheck({ company_id: localStorage.getItem('companyId') });
      this.addForm.loading = false
      if (data.status == 100) {
        this.dialogList = data.data.rows.filter(item => item.is_check === 0)
      }
    },
    async delRow(row) {//删除
      try {
        let res = await this.$confirm("确认删除吗？");
        if (res == "confirm") {
          this.loading = true;
          let { data } = await behaviorintegral_delete(row);
          if (data.status == 100) {
            this.$message.success("删除成功");
          }
          this.initList();
        }
      } catch (error) { }
    },
    async delRows() {//批量删除
      if (this.multipleSelection.length == 0) {
        this.$message.warning("请先选择需要调整单元");
        return;
      }
      const ids = this.multipleSelection.map(item => item.id).join();
      try {
        const res = await this.$confirm("确认删除吗？");
        if (res == "confirm") {
          this.loading = true;
          const { data } = await behaviorintegral_deleteAll({ array: ids });
          if (data.status == 100) {
            this.$message.success("删除成功");
          }
          this.initList();
        }
      } catch (error) {
        console.log(error, "error");
      }
    },
    async delRow(row) {
      try {
        let res = await this.$confirm('确认删除吗？')
        if (res == 'confirm') {
          this.loading = true;
          let { data } = await behaviorintegral_delete(row);
          this.loading = false;
          if (data.status == 100) {
            this.$message.success('删除成功')
            this.initList();
          }
        }
      } catch (error) {
        console.log(error, 'error')
      }
    },
    async editAction() {
      this.loading = true;
      const { data } = await behaviorintegral_edit(this.editForm)
      this.loading = false;
      if (data.status == 100) {
        this.$message.success("操作成功")
      }
      this.initList();
    },
    validate(e) {
      this.$refs[e].validate(valid => {
        if (valid) {
          this.editAction();
          this.editForm.show = false;
        } else {
          return false;
        }
      });
    },
    async effect(e) {//1 生效 0 取消
      if (this.multipleSelection.length == 0) {
        this.$message.warning('请先选择需要调整单元');
        return;
      }
      const ids = this.multipleSelection.map(item => item.id).join();
      this.loading = true;
      const { data } = await behaviorintegral_updateCloseStatus({ ids: ids, close_status: e });
      this.loading = false;
      if (data.status === 100) {
        await this.initList();
        this.$message.success('操作成功');
      }
    },
    async switchChange(row, e) {//
      const params = { ...row, close_status: ~~e }//取消内存引用问题
      this.loading = true;
      await behaviorintegral_edit(params)
      this.loading = false;
      this.initList();
    },
    search() {//搜索
      this.listQuery = searchTool(this.listQuery);
      this.initList();
    },
    handleSelectionChange(e) {//
      this.multipleSelection = e;
    },
    async initTypeList() {//初始化 积分类别
      this.typeList = await action.getTypeList();
    },
    async initToolData() {//初始化 搜索工具栏
      this.toolData = await action.getToolData();
    },
    async initList() {
      this.loading = true
      const query = { ...this.listQuery, company_id: localStorage.getItem('companyId') - 0 };
      let { data } = await behaviorintegral_list(query);
      this.loading = false
      if (data.status == 100) {
        this.tableList = data.data.rows.map(item => {
          return { ...item, switch: !!item.close_status }
        })
        this.listQuery.total = data.data.results;
      }
    },
    openEdit(scopeRow) {
      this.editForm = { show: true, ...scopeRow }
    }
  },
  created() {
    this.initList()
    this.initTypeList();
    this.initToolData();
  }
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.ali-edit-2 {
  cursor: pointer;
  color: #e6a23d;
}

.ali-bin {
  cursor: pointer;
  color: #f56c6c;
}

.dialog-table {
  padding-top: 20px;
}
</style>


